.cyc-container{
    position:relative;
    top:3rem;
    width: 90vw;
    min-height: 60vw;
    margin: 0 auto;       
    display: flex;
    justify-content:center;
    align-items: center;
    overflow:hidden;
    background-color:var(--precolor-fou);
    background: url("../photo/family_six.jpg") no-repeat center; 
    background-size: contain;
    box-shadow:0 0 .2rem .5rem rgba(0.9,0.9,0.9,.1),
                inset 0 0 .2rem .2rem rgba(0.8,0.8,0.8,.3);   
} 
.cyc-package{
    position:relative;
    display: flex;
    justify-content:center;
    align-items: center;
}    
.cyc-core{
    position:relative; 
    height:30vw;
    width:30vw;
    border-radius: 50%;
    border-style: dotted;
    border-width: thin;
    border-color: var(--precolor-thr);

    display: flex;
    animation: rotate 18s infinite linear;
    animation-play-state:running;
}
.core{
    height: 1rem;
    width: 1rem;
    margin: auto;
}
.cycleradius{
    position: absolute;
    height: 15vw;
    width: 15vw;
    border-radius: 50%;
    animation: inherit;
    animation-direction:reverse;  
    display:flex;
    align-items: center;
    justify-content: center;    
}

/* 五角星坐标 假设中心为(0，0) R:半径 K坐标(0-4) yDegree(主轴与y轴的夹角，默认为0)
（(R * cos(90°+ k * 72°+ yDegree)), (R * sin(90°+ k * 72°+ yDegree))）*/
.cycleradius1{
    left: calc(15vw * cos(1.5708rad + 0 * 1.2566rad) + 15vw - 7.5vw);
    top: calc(15vw * sin(1.5708rad + 0 * 1.2566rad) + 7.5vw);
}
.cycleradius2{
   left: calc(15vw * cos(1.5708rad + 1 * 1.2566rad) + 15vw - 7.5vw);
    top: calc(15vw * sin(1.5708rad + 1 * 1.2566rad) + 7.5vw);
}
.cycleradius3{
   left: calc(15vw * cos(1.5708rad + 2 * 1.2566rad) + 15vw - 7.5vw);
    top: calc(15vw * sin(1.5708rad + 2 * 1.2566rad) + 7.5vw);
}
.cycleradius4{
   left: calc(15vw * cos(1.5708rad + 3 * 1.2566rad) + 15vw - 7.5vw);
    top: calc(15vw * sin(1.5708rad + 3 * 1.2566rad) + 7.5vw);
}
.cycleradius5{
    left: calc(15vw * cos(1.5708rad + 4 * 1.2566rad) + 15vw - 7.5vw);
    top: calc(15vw * sin(1.5708rad + 4 * 1.2566rad) + 7.5vw);
}

.cycle{
    margin: auto;
    height: 1.5rem;
    width: 6rem;
    line-height: 1.5rem;
    text-align: center;
    border-radius: 2rem/1rem;    
    font-size: .8rem;
    font-weight: bold;
    box-shadow: .2rem .2rem .2rem rgba(0,0,0, .29), inset .2rem .2rem .2rem rgba(255,255,255, .44);
}
.item1{
    color:var(--precolor-fiv);
    background: linear-gradient(to top, var(--precolor-one) 0%, var(--precolor-one) 100%);
    z-index: 1;
}
.item2{
    color:var(--precolor-fiv);
    background: linear-gradient(to top, var(--precolor-two) 0%, var(--precolor-two) 100%);       
    z-index: 1;
}
.item3{
    color:var(--precolor-fiv);
    background: linear-gradient(to top, var(--precolor-thr) 0%, var(--precolor-thr) 100%);       
    z-index: 1;
}
.item4{
    color:var(--precolor-fiv);
    background: linear-gradient(to top, var(--precolor-fou) 0%, var(--precolor-fou) 100%);   
    z-index: 1;    
}
.item5{
    color:white;
    background: linear-gradient(to top, var(--precolor-fiv) 0%, var(--precolor-fiv) 100%);   
    z-index: 1;
}
@keyframes rotate{
    100%{transform:rotate(360deg);}
}
.cyc-core:hover{
  animation-play-state:paused;
}

.col-description{
    display: block;
    margin-top: 2rem;
    width: 100%;
    background-color:var(--precolor-fou);
    padding:.6rem .6rem;
    color: var(--precolor-fiv);
    font-size:1rem;
    text-align: center;
    word-wrap: break-word;
    position: relative;
    z-index: 1;
}
.col-description div,.coopplat-description div{
    font-weight:bold;
}

/*======铺垫部分============*/
.coopplat-container{
    position:relative;
    width: 90vw;
    min-height: 60vw;
    margin: 0 auto;
    display: flex;
    justify-content:flex-end;
    align-items: center;
    overflow:hidden;
    background: rgba(255,255,255,.5) url("../photo/family_one.jpg") no-repeat center; 
    background-size: contain;
    box-shadow:0 0 .2rem 1rem rgba(0.9,0.9,0.9,.1),
                inset 0 0 .2rem .2rem rgba(0.8,0.8,0.8,.3);              
}    
.coopplat-package{
    position:relative;
    display: flex;
    flex-direction: column;
    justify-content:flex-end;
    align-items: flex-end;
}  
.coopplat_item{
    margin: .2rem 2rem;
    height: 1.5rem;
    width: 6rem;
    line-height: 1.5rem;
    text-align: center;
    border-radius: .5rem;    
    font-size: 1rem;
    font-weight: bold;
    box-shadow: .2rem .2rem .2rem rgba(0,0,0, .29), inset .2rem .2rem .2rem rgba(255,255,255, .44);
    color:var(--precolor-fiv);
    background: linear-gradient(to top, var(--precolor-fou) 0%, var(--precolor-fou) 100%); 
}
.coopplat-description{
    width: 100%;
    background-color:var(--precolor-fou);
    padding:.6rem .6rem;
    color: var(--precolor-fiv);
    font-size:1rem;
    text-align: center;
    word-wrap: break-word;
    position: relative;
    z-index: 1;
}

/*======选择部分============*/
.majorprod-container{
    position:relative;
    width: 90vw;
    min-height: 60vw;
    margin: 0 auto;
    display: flex;
    justify-content:center;
    align-items: center;
    overflow:hidden;
    background: var(--precolor-fou) url("../photo/family_thr.jpg") no-repeat left; 
    background-size: contain;
    box-shadow:0 0 .2rem 1rem rgba(0.9,0.9,0.9,.1),
                inset 0 0 .2rem .2rem rgba(0.8,0.8,0.8,.3);                   
}    
.majorprod-package{
    margin-left: 45vw;
    width: 45vw;
    display: flex;
    flex-direction: column;
} 
.major-selectitem{
    width: 25vw;
    height: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    border-radius: .2rem;    
    color:var(--precolor-fiv);
    font-size: 1rem;
    font-weight: bold;
    background-color:var(--precolor-fou);
}
.major-selectitem:hover,.major-selectitem:active{
    color:var(--precolor-fou);
    background: var(--precolor-fiv);
}
.major-insselect{
    display: flex;
    margin: 1rem auto;
    margin-right: 1rem;
    justify-content: center;
    align-items: center;
}

.imgList{
    max-height:20vw;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: flex-start;
    overflow:scroll; 
}
.imgList img {
    height: 2rem;
    width: 2rem;
    margin: .2rem;
}

/*======推荐部分============*/
.recom-container{
    position:relative;
    width: 90vw;
    min-height: 30vw;
    margin: 0 auto;
    display: flex;
    justify-content:center;
    align-items: center;
    overflow:hidden;
    background: url("../photo/recom.webp") no-repeat center; 
    background-color: var(--precolor-fou);
    background-size: contain;
    box-shadow:0 0 .2rem 1rem rgba(0.9,0.9,0.9,.1),
                inset 0 0 .2rem .2rem rgba(0.8,0.8,0.8,.3);             
    margin-bottom: 1rem;  
}

/*======500px下小屏处理============*/
@media screen and (max-width:500px){
    /*======取消旋转效果============*/
    .cyc-package{
        display:block;
        height: 100%;
    }
    .cyc-core{
    margin-left: 45vw;
    width: 45vw;
    border: none;
    display: flex;
    flex-direction: column;
    animation: none;
    }
    .core{display: none;}
    .cycleradius{
        width: 100%;
        animation: none;
        display:block;
    }   
    .cycleradius1{height: 1rem;left: 1rem;top: 0;}
    .cycleradius5{height: 1rem;left: 1rem;top: 1.5rem;}
    .cycleradius4{height: 1rem;left: 1rem;top: 3rem;}
    .cycleradius3{height: 1rem;left: 1rem;top: 4.5rem;}
    .cycleradius2{height: 1rem;left: 1rem;top: 6rem;}
    .cycle{ 
        width: 6rem;   
        height: 1rem;
        line-height: 1rem;
        font-size: .8rem;
        border-radius: .5rem; }
    .cyc-core:focsu{
    animation-play-state:paused;
    }
    /*======文本缩小============*/
    .col-description{
    padding:1rem 1rem;
    font-size:1rem;
    }  
    .coopplat-description{
    padding:1rem 1rem;
    font-size:1rem;
    }
    /*======取消公司列表============*/
    .major-insselect{display: none;}
    .major-selectitem{
        border-radius: .2rem;
        font-size:1rem;
        width: 30vw;
    }
    #col_desc1{display: none;}
    #coop_desc1{display: none;}
    #major_desc1{display: none;}
    
}